<template>
  <div id="app">
    <site-header />
    <div class="home-cotainer">
      <router-view />
    </div>
  </div>
</template>

<script>
import SiteHeader from "@/components/SiteHeader";

export default {
  name: "App",
  components: {
    SiteHeader,
  },
  watch: {
    // 监听路由地址的变化
    "$route.path"(newPath, oldPath) {
      this.$store.commit("changeActivePage", newPath);
    },
    // 监听路由的变化，包括传递的参数
    $route(to, from) {
      // console.log(to.query.id);
      this.$store.commit("changeItemQueryId", to.query.id);
    },
  },
};
</script>

<style>
@import url("./assets/css/base.css");
body {
  background-color: #eae8eb;
}
.home-cotainer {
  width: 1250px;
  margin: 0 auto;
}
</style>
